<template>
<!--  组件的结构-->
  <div >
    <h2 >学校名称：{{ name|mySlice }}</h2>
    <h2>学校地址：{{ address }}</h2>
<button @click="testHello">点我测试一下hello方法</button>
  </div>
</template>
<script>
//组件交互相关的代码（数据、方法等等）
//   const school=Vue.extend(options)可以简写为 const school=options
export default {
  name:'School',
  data() {
    return {
      address:'北京',
      name:'尚硅谷atguigu'
    }
  },
  methods:{
    testHello(){
      console.log(this)
  /*    1.一个重要的内置关系：VueComponent.prototype.__proto__===Vue.prototype
      2.为什么要有这个关系：让组件实例对象（vc）可以访问到Vue原型上的属性、方法*/
      this.hello()
    }
  }
}
</script>
<style>
/*组件的样式*/

</style>